<template>
    <div class="w750">
        <template v-if="isSupportReturn">
            <div class="submit-order" :class="themes.theme" :style="{ '--themescolor': themes.color }">
                <div class="submit-list">
                    <div class="submit-con" style="margin-top: 0">
                        <!-- 单个退货退款模式 -->
                        <div class="pro-mes" style="border-top: 0" v-if="orderInfo.items.length && orderInfo.items.length == 1">
                            <div class="pro-img">
                                <legend-image
                                    :pic="orderInfo.items[0].prodPic"
                                    :type="'wh'"
                                    :options="{ w: '80', h: '80' }"
                                    :class="'needsclick'"
                                    :isJD="orderInfo.items[0].prodSource == 'JD'"
                                />
                                <img src="@/assets/images/haitao-small.png" class="haitao" v-if="orderInfo.items[0].goodsType == 'overseas'" />
                            </div>
                            <div class="pro-name">
                                <a href="#" class="name">{{ orderInfo.items[0].prodName }}</a>
                                <div class="sku">{{ orderInfo.items[0].attribute == '' ? '' : orderInfo.items[0].attribute }}</div>
                                <span class="price">
                                    ￥
                                    <em class="now text-main">{{ Money(orderInfo.items[0].prodPrice)[0] }}</em>
                                    .{{ Money(orderInfo.items[0].prodPrice)[1] }}
                                </span>
                            </div>
                            <div class="pro-num">×{{ goodsNum }}</div>
                        </div>
                        <!-- 批量退货退款模式 -->
                        <div class="pro-mes" style="border-top: 0" v-else>
                            <div class="pro-img" v-for="(item, index) in orderInfo.items" :key="index" style="margin-right: 10px">
                                <legend-image
                                    :pic="item.prodPic"
                                    :type="'wh'"
                                    :options="{ w: '80', h: '80' }"
                                    :class="'needsclick'"
                                    :isJD="item.prodSource == 'JD'"
                                />

                                <img src="@/assets/images/haitao-small.png" class="haitao" v-if="item.goodsType == 'overseas'" />
                            </div>
                        </div>
                    </div>
                    <div class="submit-con">
                        <div class="order-style">
                            <span class="left">申请服务</span>
                            <span class="right">
                                <em class="right-em text">{{ orderInfo.serviceType == 1 ? '仅退款' : '退款退货' }}</em>
                            </span>
                        </div>
                        <div class="order-style bt">
                            <span class="left">退款原因</span>
                            <span class="right" @click="showapplyMessage">
                                <em class="right-em">{{ applyForm.applyMessage }}</em>
                                <i class="arr"><img src="../../../assets/images/arrow.png" alt="" /></i>
                            </span>
                        </div>
                        <!-- 退货数量 -->
                        <div class="order-style bt" v-if="serviceType == '2' && orderInfo.applyType == 2">
                            <!-- 单个 -->
                            <template v-if="orderInfo.items.length == 1">
                                <span class="left">退货数量</span>
                                <span class="right words">
                                    <input
                                        class="num text-main"
                                        style="text-align: left"
                                        type="text"
                                        :placeholder="'最多' + (orderInfo.totalGoodsCount || 1) + '件'"
                                        v-model.number="orderInfo.items[0].basketCount"
                                        :disabled="!orderInfo.isUpdateAmount"
                                    />
                                    <i class="unit">件</i>
                                </span>
                            </template>
                            <!-- 多个 -->
                            <template v-else>
                                <span class="left">退货总数量</span>
                                <span class="right words">
                                    <input class="num text-main" style="text-align: left" type="text" v-model="totalGoodsCount" disabled />
                                    <i class="unit">件</i>
                                </span>
                            </template>
                        </div>
                        <!-- 退款金额 -->
                        <div class="order-style bt">
                            <template v-if="orderInfo.items.length && orderInfo.items.length == 1">
                                <!-- 单个 -->
                                <span class="left">退款金额</span>
                                <span class="right words price">
                                    <input
                                        class="num"
                                        style="text-align: left"
                                        type="text"
                                        :placeholder="'最多' + orderInfo.totalRefundAmount + '元'"
                                        v-model.number="orderInfo.items[0].refundAmount"
                                        :disabled="!orderInfo.isUpdateAmount"
                                    />
                                    <i class="unit text-main">￥</i>
                                </span>
                            </template>
                            <!-- 多个 -->
                            <template v-else>
                                <span class="left">退款总金额</span>
                                <span class="right words price">
                                    <input class="num" style="text-align: left" type="text" v-model="totalPrice" disabled />
                                    <i class="unit text-main">￥</i>
                                    <i class="arr" @click="goReturnGoodsList">
                                        <img src="../../../assets/images/arrow.png" alt="" />
                                    </i>
                                </span>
                            </template>
                        </div>
                    </div>

                    <!-- 未发货时申请售后运费总是为0.00元 -->
                    <span style="font-size: 12px; margin-left: 10px" v-if="orderInfo.applyType == 1">
                        最多可退货数量 {{ orderInfo.totalGoodsCount }} 件, 最多可退 ￥{{ orderInfo.totalRefundAmount }}
						<span v-if="orderInfo.totalFreightAmount !=0">
							（含运费￥{{orderInfo.totalFreightAmount}}元)
						</span>
                    </span>
                    <!-- 发货后的状态 且运费不为0展示 -->
                    <span style="font-size: 12px; margin-left: 10px" v-if="orderInfo.applyType == 2">
                        最多可退货数量 {{ orderInfo.totalGoodsCount }} 件, 最多可退 ￥{{ orderInfo.totalRefundAmount }}
						<span v-if="orderInfo.totalFreightAmount !=0">
							（扣除运费￥{{ orderInfo.totalFreightAmount }} 后)
						</span>
                    </span>
                    <!-- 退货方式 -->
                    <div class="submit-con" v-if="orderInfo.applyType == 2 && serviceType == 2">
                        <div class="order-style" @click="showPopup">
                            <span class="left">退货方式</span>
                            <span class="right">
                                <em class="right-em text">{{ userReturnGoodsType }}</em>
                                <i class="arr"><img src="../../../assets/images/arrow.png" alt="" /></i>
                            </span>
                        </div>
                        <!-- 上门取件地址 只有当选择上门取件时才显示-->
                        <template v-if="selectReturnType == 'CALL_COLLECT' && addressInfo">
                            <div class="order-style" style="font-weight: 700" v-if="isCall">
                                <div>
                                    <van-icon name="location-o" class="rtIcon" />
                                    <span>{{ addressInfo.receiver }}</span>
                                </div>
                                <span class="right">
                                    <em class="right-em">{{ addressInfo.mobile }}</em>
                                    <i class="arr" @click="goAddress"><img src="../../../assets/images/arrow.png" alt="" /></i>
                                </span>
                            </div>
                            <div class="order-style" style="margin-left: 10px" v-if="isCall">
                                {{ addressInfo.province }} {{ addressInfo.city }} {{ addressInfo.area }} {{ addressInfo.town }}
                                {{ addressInfo.subAdds }}
                            </div>
                        </template>
                        <template v-if="selectReturnType == 'CALL_COLLECT' && !addressInfo">
                            <div class="order-address">
                                <div @click="goAddress">
                                    <div class="user-info">
                                        <img :src="require(`@/assets/style-images/sub-local-${themes.theme}.png`)" alt="" />
                                        <em class="item">请选择上门取件地址</em>
                                        <em class="item"></em>
                                    </div>
                                    <div class="address-det"></div>
                                    <i class="arr"><img src="@/assets/images/arrow.png" alt="" /></i>
                                </div>
                            </div>
                        </template>
                    </div>
                    <!-- 退款说明 -->
                    <div class="submit-con">
                        <van-field
                            v-model="applyForm.applyRemark"
                            rows="3"
                            autosize
                            type="textarea"
                            maxlength="50"
                            placeholder="退款说明,必填"
                            show-word-limit
                        />
                        <!-- <textarea class="area" placeholder="退款说明，选填" maxlength="50" show-word-limit v-model="applyForm.applyRemark"></textarea> -->
                    </div>
                    <!-- 上传凭证 -->
                    <div class="submit-con">
                        <div class="file-img">
                            <span class="file-txt img">上传凭证</span>
                            <span class="add-img" v-for="(item, index) in dynamicPics" :key="index">
                                <img :src="$imgUrlHead + item" alt="" />
                                <i class="del-img" @click="delpic(dynamicPics[index], index)">×</i>
                            </span>
                            <span class="add-img files" v-show="isAddImg">
                                <em class="add-txt">+</em>
                                <!--<input type="file" name="files" class="uploader"  @change="upload" accept="image/*" ref="picture" >-->
                                <input
                                    type="file"
                                    name="files"
                                    class="uploader hiddenInput"
                                    accept="image/*"
                                    @change="upload"
                                    v-if="!isApp"
                                    ref="picture"
                                />
                                <div @click="showpic" v-if="isApp"></div>
                            </span>
                            <p class="add-img-tip txt">温馨提示：最多添加3张图片</p>
                        </div>
                    </div>
                    <!-- 联系人 自行寄回时显示 -->
                    <div class="submit-con" v-if="!isCall">
                        <div class="order-style">
                            <span class="left">联系人</span>
                            <input class="num" style="text-align: left" v-model="orderInfo.userAddr.userContactsName" placeholder="请输入联系人" />
                        </div>
                        <div class="order-style">
                            <span class="left">手机号码</span>
                            <input
                                class="num text"
                                style="text-align: left"
                                v-model="orderInfo.userAddr.userContactsPhone"
                                placeholder="请输入手机号码"
                            />
                        </div>
                    </div>
                    <div class="footerText text">提交申请后, 可能会有客服联系您, 请保持手机通畅!</div>
                    <div style="height: 58px"></div>
                </div>
                <span class="apply-btn" @click="comfirmApply">提交申请</span>
            </div>
        </template>
        <templates v-else>
            <Noempty :pic="require('@/assets/images/review.png')" :title="errorTitle || '网络错误请返回'" />
        </templates>
        <van-popup v-model="show" position="bottom">
            <van-picker :columns="columns" show-toolbar title="请选择你的退货原因" @cancel="onCancel" @confirm="onConfirm" />
        </van-popup>
        <!--上传图片选择-->
        <van-action-sheet v-model="picshow" :actions="actions" cancel-text="取消" @select="onSelect" @cancel="onCancel" />
        <!--/上传图片选择-->

        <!-- 选择退货方式 -->
        <van-popup v-model="showReturnMethod" round overlay position="bottom" title="退货方式" closeable>
            <div class="returntitle">退货方式</div>
            <van-radio-group v-model="returnSelectList">
                <van-cell-group :border="false">
                    <van-cell
                        clickable
                        v-for="(item, index) in orderInfo.returnGoodsTypes"
                        :key="index"
                        @click="selectReturnGoodsType(item.returnGoodsType, item.returnGoodsName)"
                    >
                        <div class="title">{{ item.returnGoodsName }}</div>
                        <span style="font-size: 14px" class="text-999">{{ item.desc }}</span>
                        <template #right-icon>
                            <van-radio :name="item.returnGoodsType" checked-color="#FF4444" />
                        </template>
                    </van-cell>
                </van-cell-group>
            </van-radio-group>
            <div style="width: 90%; margin: 0 auto">
                <van-button @click="submitReturn" round block type="danger info" native-type="submit" style="margin: 64px 0 20px">确定</van-button>
            </div>
        </van-popup>
        <!-- 选择退货方式 -->
    </div>
</template>

<script>
import legendImage from 'components/legendImage/legendImage'
import { afterSale } from 'api/afterSale'
import { address } from 'api/addressManage'
import cash from 'utils/tool'
import { mapState } from 'vuex'
import { ActionSheet } from 'vant'
import generalServiceImpl from 'utils/upLoadPic'
import Noempty from 'components/Noempty/Noempty'
import {
    refundApply,
    refundSave,
    refundReturn,
    itemRefund,
    itemReturn,
    uploadImg,
    deletePic,
    editAction,
    submitAgainApply,
    deletePhotos
} from 'api/refunds'
const MaxImg = 3
export default {
    components: {
        legendImage,
        Noempty
    },
    data() {
        return {
            totalGoodsCount: '', //全部退货数量
            totalPrice: '', //全部退款金额
            isCall: false, //是否上门取件
            serviceType: '', //售后服务类型
            flag: false, //是否从选择地址过来
            isEditGoods: false, //是否从修改商品金额过来
            goodsNum: '', //退款数量
            refundAmount: '', //退款金额
            orderInfo: {
                items: [],
                userAddr: {}
            },
            selectReturnName: '', //存储退货名称
            selectReturnType: '', //存储退货类型
            returnSelectList: '', //单选框组值
            userReturnGoodsType: '', //回显返货方式名称
            applyForm: {
                // applyType: '', //服务类型
                applyMessage: '', //申请原因
                // applyRemark: '', //售后说明
                // photoFiles: [], //凭证图片集合 多个以逗号分隔 ,
                // orderId: '', //订单id
                // serviceType: '', //售后服务类型
                // userReturnGoodsType: '', //返货方式
                // userContactsName: '', //用户联系人
                // userContactsPhone: '', //用户联系人手机号
                // fetchProvinceId: '', //取件省份ID 上门取件必填
                // fetchCityId: '', //取件城市ID 上门取件必填
                // fetchTownId: '', //取件乡镇ID 上门取件必填
                // fetchAreaId: '', //取件县ID 上门取件必填
                // fetchDetailedAddress: '', //取件街道地址 上门取件必填
                items: [] //售后订单项
            },

            addressInfo: null, //上门取件信息
            showReturnMethod: false, //显示隐藏退货方式弹出层
            photoFile: [], //照片数量
            dynamicPics: [], //存放添加图片
            Money: cash, //价格转换
            show: false,
            columns: ['未按时发货', '拍错/多拍/不喜欢', '包装破损', '协商一致退款', '质量问题', '其他'],
            actions: [
                {
                    name: '相册'
                },
                {
                    name: '相机'
                }
            ],
            picshow: false,
            isApp: false,
            isSupportReturn: true, //是否支持退款
            errorTitle: '' // 失败信息
        }
    },
    //keep alive 生命函数 每次进入页面触发
    activated() {
        // 从localstorage获取数据
        if (sessionStorage.getItem('addressInfo')) {
            let item = sessionStorage.getItem('addressInfo')

            item = JSON.parse(item)
            this.addressInfo = item
            this.flag = false
            return
        }
        //获取修改商品金额数量
        if (this.isEditGoods) {
            const returnGoodsinfo = JSON.parse(sessionStorage.getItem('returnGoodsInfo'))
            if (returnGoodsinfo) {
                this.totalGoodsCount = returnGoodsinfo.obj.totalSum
                this.totalPrice = returnGoodsinfo.obj.totalPrice
                this.orderInfo.items = returnGoodsinfo.items
            }
            this.isEditGoods = false
            return
        }

        this.getData()
    },
    //keep alive 生命函数 每次离开页面触发
    deactivated() {
        //如果为true 则证明是从选择上门地址返回或修改商品信息返回
        if (this.flag || this.isEditGoods) {
            return
        }
        sessionStorage.removeItem('addressInfo')
        this.$destroy()
    },
    mounted() {
        this.Ishas()
        // 开始获取数据
    },
    methods: {
        //获取数据
        getData() {
            this.serviceType = this.$route.query.serviceType
            let orderId = this.$route.query.orderId
            let orderItemId = this.$route.query.orderItemId
            this.$toast.loading({
                message: '加载中...',
                forbidClick: true
            })
            afterSale
                .getApplyReturn({
                    serviceType: this.serviceType,
                    orderId: orderId,
                    orderItemIds: orderItemId
                })
                .then((res) => {
                    if (res.status == 1) {
                        this.goodsNum = res.result.items[0].basketCount
                        this.totalGoodsCount = res.result.totalGoodsCount
                        this.totalPrice = res.result.totalRefundAmount
                        this.orderInfo = res.result
                    } else {
                        this.isSupportReturn = false
                        this.errorTitle = res.msg
                        this.$toast(res.msg)
                    }
                })
        },
        //选择返货方式
        selectReturnGoodsType(type, name) {
            //存储起来
            this.returnSelectList = type
            this.selectReturnName = name
        },
        //确定退货方式
        submitReturn() {
            // 如果选择上门取件 则获取用户的默认收货地址作为上门取件地址
            if (this.returnSelectList == 'CALL_COLLECT') {
                address().then((res) => {
                    if (res.status !== 1) {
                        this.$toast(res.msg)
                        this.returnSelectList = 'USER_GOODS'
                        this.showReturnMethod = false
                        return
                    }
                    // 拿默认收货地址
                    this.addressInfo = res.result.find((item) => item.commonAddr == '1') || null
                    this.userReturnGoodsType = this.selectReturnName
                    this.selectReturnType = this.returnSelectList
                    this.isCall = true
                    this.showReturnMethod = false
                })
            } else {
                this.isCall = false
                this.userReturnGoodsType = this.selectReturnName
                this.selectReturnType = this.returnSelectList
                this.showReturnMethod = false
            }
        },
        //去修改地址
        goAddress() {
            this.flag = true
            // 传递flag 标记从售后详情过去
            this.$router.push({
                path: '/addressList',
                query: {
                    type: 'after'
                }
            })
        },
        //去退款商品列表
        goReturnGoodsList() {
            const goodsList = JSON.stringify(this.orderInfo.items)
            this.isEditGoods = true
            this.$router.push({
                path: '/returnGoodsList',
                query: {
                    content: goodsList
                }
            })
        },

        //显示退货方式弹出层
        showPopup() {
            this.showReturnMethod = true
        },
        //是否是app
        Ishas() {
            if (window.plus) {
                this.isApp = true
            } else {
                this.isApp = false
            }
        },
        // 弹出上传
        showpic() {
            this.picshow = true
        },
        //关闭弹窗
        onCancel() {
            this.picshow = false
        },
        onSelect(item) {
            this.picshow = false
            if (item.name == '相册') {
                this.appendByGallery()
            } else if (item.name == '相机') {
                this.getImage()
            }
        },
        //相册上传图片
        appendByGallery() {
            let This = this
            generalServiceImpl.appendByGallery().then((res) => {
                This.dynamicPics.push(res)
                let index = this.dynamicPics.length - 1
                This.photoFile[' + index + '] = res
            })
        },
        //拍照上传图片
        getImage() {
            let This = this
            generalServiceImpl.getImage().then((res) => {
                This.dynamicPics.push(res)
                let index = this.dynamicPics.length - 1
                This.photoFile[' + index + '] = res
            })
        },
        goback() {
            this.$router.back()
            this.$router.isBack = true
        },
        //提交申请
        comfirmApply() {
            let regRule = /\uD83C[\uDF00-\uDFFF]|\uD83D[\uDC00-\uDE4F]/g
            //当售后时
            if (this.orderInfo.applyType == 2) {
                if (this.orderInfo.items.length == 1) {
                    if (this.orderInfo.items[0].basketCount == '' || this.orderInfo.items[0].basketCount > this.orderInfo.totalGoodsCount) {
                        this.$toast('亲,请填写正确的退货数量，且不能大于' + (this.orderInfo.totalGoodsCount || 1) + '件')
                        return
                    }
                    if (this.orderInfo.items[0].refundAmount == '' || this.orderInfo.items[0].refundAmount > this.orderInfo.totalRefundAmount) {
                        this.$toast('亲,请填写正确的退款金额，且不能大于' + this.orderInfo.totalRefundAmount + '元')
                        return
                    }
                }
            }
            //没有选择退款原因
            if (this.applyForm.applyMessage == '') {
                this.$toast('亲,请选择退款原因')
                return
            }
            //退款说明不符合
            if (this.applyForm.applyRemark && this.applyForm.applyRemark.match(regRule)) {
                this.$toast('退款说明不支持表情')
                return
            }
            if (!this.applyForm.applyRemark || this.applyForm.applyRemark.trim() == '') {
                this.$toast('退款说明不能为空')
                return
            }
            //当退款退货时 添加返货方式
            if (this.orderInfo.serviceType == 2) {
                // 没有选择返货方式
                if (this.selectReturnType == '') {
                    this.$toast('亲,请选择返货方式')
                    return
                }
                this.applyForm.userReturnGoodsType = this.selectReturnType
            }
            //上门取件时
            if (this.selectReturnType == 'CALL_COLLECT') {
                if (!this.addressInfo) {
                    this.$toast('亲,请选择上门取件地址')
                    return
                }
                this.applyForm.fetchProvinceId = this.addressInfo.provinceId //取件省份ID 上门取件必填
                this.applyForm.fetchCityId = this.addressInfo.cityId //取件城市ID 上门取件必填
                this.applyForm.fetchTownId = this.addressInfo.townId //取件乡镇ID 上门取件必填
                this.applyForm.fetchAreaId = this.addressInfo.areaId //取件县ID 上门取件必填
                this.applyForm.fetchDetailedAddress =
                    this.addressInfo.province + this.addressInfo.city + this.addressInfo.area + this.addressInfo.town + this.addressInfo.subAdds //取件地址 上门取件必填
            } else {
                this.applyForm.fetchDetailedAddress = this.orderInfo.userAddr.userDetailAddress //京东限制自行寄回也要详情地址
            }
            //当有上传照片时
            if (this.dynamicPics.length > 0) {
                this.applyForm.photoFiles = this.dynamicPics.join()
            }
            //获取每个商品价格 数量 订单项
            const list = this.orderInfo.items
            for (let i = 0; i < list.length; i++) {
                let obj = { basketCount: list[i].basketCount, orderItemId: list[i].orderItemId, refundAmount: list[i].refundAmount }
                this.applyForm.items.push(obj)
            }
            //给表单赋值
            this.applyForm.orderId = this.$route.query.orderId
            this.applyForm.serviceType = this.orderInfo.serviceType
            this.applyForm.applyType = this.orderInfo.applyType
            this.applyForm.userContactsName = this.orderInfo.userAddr.userContactsName
            this.applyForm.userContactsPhone = this.orderInfo.userAddr.userContactsPhone
            //提交行为
            this.$toast.loading({
                forbidClick: true,
                message: '申请提交中'
            })
            setTimeout(() => {
                afterSale.applySubmit(this.applyForm).then((res) => {
                    if (res.status !== 1) {
                        this.$toast({ message: res.msg })
                        return
                    }
                    this.successHandle()
                })
            }, 1000)
        },
        successHandle() {
            this.$toast({
                forbidClick: true,
                message: '提交成功'
            })
            setTimeout(() => {
                sessionStorage.removeItem('afterData')
                this.gobackPach()
            }, 1500)
        },
        //是否为正整数
        isPositiveNum(s) {
            let re = /^[0-9]*[1-9][0-9]*$/
            return re.test(s)
        },
        showapplyMessage() {
            this.show = true
        },
        onConfirm(e) {
            this.applyForm.applyMessage = e
            this.show = false
        },
        onCancel() {
            this.show = false
        },
        upload(e) {
            let _this = this
            var files = e.target.files[0]
            if (files) {
                if (!e || !window.FileReader) return // 看支持不支持FileReader
                let reader = new FileReader()
                reader.onloadend = function () {
                    // _this.portraitPic = this.result
                }
                let file = e.target.files[0]
                var data = new FormData()
                data.append('photos', this.$refs.picture.files[0])

                this.$toast.loading({
                    message: '上传中',
                    forbidClick: true,
                    duration: 0
                })

                uploadImg(data).then((res) => {
                    if (res.status == 1) {
                        this.$toast.clear()
                        this.$toast('上传成功')
                        this.dynamicPics.push(res.result[0])
                        let index = this.dynamicPics.length - 1
                        this.photoFile[' + index + '] = res.result
                    } else {
                        this.$toast('上传失败')
                    }
                })
            }
        },
        //删除图片
        delpic(picPath, index) {
            let ImgIndex = index
            let imgs = this.dynamicPics
            this.$dialog
                .confirm({
                    title: '是否删除此张图片',
                    message: '请再三考虑哦~~~'
                })
                .then(() => {
                    deletePhotos({ photos: imgs[ImgIndex] }).then((res) => {
                        if (res.status == 1) {
                            this.$toast('删除成功')
                            imgs.splice(ImgIndex, 1)
                            this.dynamicPics = imgs
                        } else {
                            this.$toast(res.msg)
                        }
                    })
                    // deletePic({
                    //     picPath: picPath
                    // }).then( res =>{
                    //     if (res.status == 1) {
                    //         this.$toast('删除成功')
                    //         imgs.splice(ImgIndex, 1);
                    //         this.dynamicPics = imgs
                    //     } else {
                    //         this.$toast(res.msg)
                    //     }
                    // })
                })
                .catch(() => {
                    // on cancel
                })
        },
        gobackPach() {
            this.$router.replace({
                path: `/returnList`
            })
        }
    },
    computed: {
        ...mapState(['themes']),
        isAddImg() {
            if (this.dynamicPics.length >= MaxImg) {
                return false
            } else {
                return true
            }
        }
    }
}
</script>

<style src="../../../assets/css/return.css" scoped></style>
<style src="../../../assets/css/popup.css" scoped></style>
<style src="../../../assets/css/submit-order.css" scoped></style>
<style src="../../../assets/css/style/submit-order-style.css" scoped></style>
<style scoped>
.files {
    position: relative;
}
.files input {
    position: absolute;
    font-size: 100px;
    right: 0;
    top: 0;
    opacity: 0;
    /*width: 100%;*/
    height: 100%;
}
.files div {
    position: absolute;
    font-size: 100px;
    right: 0;
    top: 0;
    opacity: 0;
    width: 100%;
    height: 100%;
}
.submit-order .submit-list .submit-con .right.words .num {
    background: transparent;
}

.returntitle {
    text-align: center;
    padding: 20px;
    font-style: 14px;
}
.title {
    font-size: 16px;
}
.returnText {
    margin: 5px 3px;
    padding: 0 3px;
    background-color: #fee6e8;
    font-size: 12px !important;
    color: #f24e79;
}
.text {
    color: #969799 !important;
}
.img {
    margin-right: 10px;
}
.txt {
    margin-left: 57px;
}
.priceInfo {
    display: flex;
    justify-content: space-between;
}
.rtIcon {
    vertical-align: middle;
    padding: 0 0.08rem 0.08rem 0;
}
.footerText {
    padding: 10px;
    text-align: left;
    font-size: 14px;
}
.van-cell {
    padding: 10px 10px;
}
</style>
